//index.js
//获取应用实例
const app = getApp()

Page({
  data: {
    name: "驯龙高手3",
    week: '星期五',
    date: '03月02日',
    time: '17:00-20:00',
    ting: '1号厅',
    list: [
      '16排05座', '6排06座'
    ],
    windowHeight: ''

  },
  //事件处理函数

  onLoad: function() {
    var that = this
    wx.getSystemInfo({
      success: function(res) {
        that.setData({
          windowHeight: res.windowWidth
        })
      }
    })
  },
  onReady: function() {
    var that =this
    const context = wx.createCanvasContext('firstCanvas')
    context.setFontSize(20) //字体尺寸
    context.fillText(this.data.name, 20, 20) //电影名字  位置
    context.setFillStyle("#E43C26")
    context.setFontSize(12) //字体尺寸
    context.fillText(this.data.week, 20, 50)
    context.setFontSize(12) //字体尺寸
    context.fillText(this.data.date, 60, 50)
    context.setFontSize(12) //字体尺寸
    context.fillText(this.data.time, 120, 50)
    context.setFillStyle("#333333")
    context.setFontSize(12) //字体尺寸
    context.fillText(this.data.ting, 20, 80)
    for (var i = 0; i < this.data.list.length; i++) {
      context.fillText(this.data.list[i], 60 + 60 * i, 80)
    }
    context.setLineDash([3, 15]);
    context.lineWidth = 2;
    context.strokeStyle = '#ccc';
    context.beginPath();
    context.moveTo(0, 120);
    context.lineTo(1000, 120);
    context.stroke();
    context.setFontSize(12) //字体尺寸
    context.textAlign = "center"
    context.fillText('请到影院内取票机取票', this.data.windowHeight / 2, 125)
    num(2, this)
    // const imgPath2 = 'http://imgtest.kpcx179.com/KP_Pay/MovieQrCode/DY20190318mpDZPN3E.png';
    // wx.getImageInfo({
    //   src: imgPath2,
    //   success(res) {
    //     console.log(res)
    //     context.drawImage(res.path, 200, 200, 150,150);
    //     context.draw()
    //   }
    // });
    var path = 'https://www.weiuid.com/attachs/uploads/20180912/d70711527c3ca66054f9989af7975d87.jpg';
    wx.getImageInfo({
      src: path,//服务器返回的图片地址
      success: function (res) {
        //res.path是网络图片的本地地址
        let Path = res.path;
        // that.data.imgUrl = res.path;
        context.drawImage(Path, that.data.windowHeight / 2 -100, 200, 200, 200)
        context.draw(false, function () {

        });
      },
      fail: function (res) {
        //失败回调
      }
    });
    
    
    // context.draw()
    function num(a, that) {
      if (a < 1) {
        context.setFontSize(12) //字体尺寸
        context.fillText('验证码', that.data.windowHeight / 2 , 155)
      } else {
        context.setFontSize(12) //字体尺寸
        context.fillText('取票号', that.data.windowHeight / 2 , 155)
        context.fillText('验证码', that.data.windowHeight / 2 , 175)
      }
    }
    setTimeout(() => {
      this.drawAfter();
    }, 1000);
  },
  savePhotoFn:function(){ //保存图片
    wx.saveImageToPhotosAlbum({
      filePath: this.data.imgUrl,
      success: function (res) {
        console.log("成功")
      }
    })
  },
  drawAfter: function () {  //将camvas变成图片
    var that= this
    wx.canvasToTempFilePath({
      width: that.data.windowHeight,
      heght: 500,
      canvasId: 'firstCanvas',
      fileType: 'jpg',
      quality: 1,
      success: function (res) {
        that.data.imgUrl = res.tempFilePath
        console.log(res.tempFilePath)
      },
      fail: function (res) {
      }
    })
  }
  
})